/*
 * @Author: xuchao 
 * @Date: 2018-05-16 14:10:53 
 * @Last Modified by: xuchao
 * @Last Modified time: 2018-06-22 11:10:42
 */
import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import { Layout } from 'antd';
import './style.less';

export default class Company extends Component {
    constructor(props){
        super(props)
        this.state = {
            list: [{
                url: require('@/static/images/company-14.png'),
                name: '冠辰',
                index: 14
            }, {
                url: require('@/static/images/company-1.png'),
                name: '阿里安全',
                index: 1
            }, {
                url: require('@/static/images/company-2.png'),
                name: '360企业安全',
                index: 2
            }, {
                url: require('@/static/images/company-3.png'),
                name: '网易',
                index: 3
            }, {
                url: require('@/static/images/company-4.png'),
                name: '京东',
                index: 4
            }, {
                url: require('@/static/images/company-5.png'),
                name: '深信服',
                index: 5
            }, {
                url: require('@/static/images/company-6.png'),
                name: '默安科技',
                index: 6
            }, {
                url: require('@/static/images/company-7.png'),
                name: '安天',
                index: 7
            }, {
                url: require('@/static/images/company-8.png'),
                name: '知道创宇',
                index: 8
            }, {
                url: require('@/static/images/company-9.png'),
                name: '先特网络',
                index: 9
            }, {
                url: require('@/static/images/company-10.png'),
                name: '绿盟科技',
                index: 10
            }, {
                url: require('@/static/images/company-11.png'),
                name: '安全狗',
                index: 11
            }, {
                url: require('@/static/images/company-12.png'),
                name: '百度安全',
                index: 12
            }, {
                url: require('@/static/images/company-13.png'),
                name: '腾讯安全',
                index: 13
            }, {
                url: require('@/static/images/company-15.png'),
                name: '亚信安全',
                index: 15
            }, {
                url: require('@/static/images/company-16.png'),
                name: '金山云',
                index: 16
            }, {
                url: require('@/static/images/company-17.png'),
                name: '三零卫士',
                index: 17
            }, {
                url: require('@/static/images/company-18.png'),
                name: '几维安全',
                index: 18
            }, {
                url: require('@/static/images/company-19.png'),
                name: '重庆无声无息',
                index: 19
            }, {
                url: require('@/static/images/company-20.png'),
                name: '蚂蚁金服',
                index: 20
            }, {
                url: require('@/static/images/company-21.png'),
                name: '新浪',
                index: 21
            }, {
                url: require('@/static/images/company-22.png'),
                name: '云天安全',
                index: 22
            }, {
                url: require('@/static/images/company-23.png'),
                name: '同盾科技',
                index: 23
            }, {
                url: require('@/static/images/company-24.png'),
                name: '墨云科技',
                index: 24
            }, {
                url: require('@/static/images/company-25.png'),
                name: '守内安',
                index: 25
            }, {
                url: require('@/static/images/company-26.png'),
                name: '君立华域',
                index: 26
            }, {
                url: require('@/static/images/company-27.png'),
                name: '天存',
                index: 27
            }, {
                url: require('@/static/images/company-28.png'),
                name: '安恒信息',
                index: 28
            }, {
                url: require('@/static/images/company-29.png'),
                name: '山石网科',
                index: 29
            }, {
                url: require('@/static/images/company-30.png'),
                name: '蓝盾',
                index: 30
            }, {
                url: require('@/static/images/company-31.png'),
                name: '北信源',
                index: 31
            }, {
                url: require('@/static/images/company-32.png'),
                name: '启明星辰',
                index: 32
            }]
        }
    }

    render() {
        const { list } = this.state;
        return (
            <Layout.Content className="company">
                <div className="banner animated fadeIn">
                    <div className="search">
                        <input type="text" placeholder="请输入公司名" />
                        <button>
                            <i />搜索
                        </button>
                    </div>
                </div> 
                {/*
                <div className="type">
                    <ul>
                        <li>
                            <em>安全厂商：</em>
                            <div className="list">
                                <span>本部</span>
                                <span>子公司</span>
                                <span>分公司</span>
                                <span>本部</span>
                                <span>子公司</span>
                                <span>分公司</span>
                            </div>
                        </li>
                        <li>
                            <em>安全集成商：</em>
                            <div className="list">
                                <span>本部</span>
                                <span>子公司</span>
                                <span>分公司</span>
                                <span>本部</span>
                                <span>子公司</span>
                                <span>分公司</span>
                            </div>
                        </li> 
                        <li>
                            <em>安全服务商：</em>
                            <div className="list">
                                <span>本部</span>
                                <span>子公司</span>
                                <span>分公司</span>
                                <span>本部</span>
                                <span>子公司</span>
                                <span>分公司</span>
                            </div>
                        </li> 
                        <li>
                            <em>测评机构：</em>
                            <div className="list">
                                <span>本部</span>
                                <span>子公司</span>
                                <span>分公司</span>
                                <span>本部</span>
                                <span>子公司</span>
                                <span>分公司</span>
                            </div>
                        </li> 
                    </ul>
                </div>
                */}
                <div className="company-list">
                    <ul>
                        {
                            list && list.map((item, index) => {
                                return (
                                    <li key={index}>
                                        <Link to={'/company/1'}>
                                            <img src={item.url} alt=""/>
                                            <p>{item.name}</p>
                                        </Link>
                                    </li>
                                )
                            })
                        }
                    </ul>
                </div>
            </Layout.Content>
        );
    }
}